<template>
  <div class="index">
    <div style="padding: 0.2rem 0.3rem; position: relative; background: #1989fa; height: 0.9rem;" class="flexcc">
    	<div style="position: absolute; left: 0.3rem; top: 0rem; height: 100%;" class="flexc"><van-icon name="arrow-left" size="0.3rem" style="font-weight: bold;" @click="back()" color="#fff" /></div>
    	<div style="color: #fff;  font-weight: bold;">{{title}}</div>
    </div>
    <div style="padding: 0.3rem;">
    	<van-cell-group>
    	  <van-field required v-model="all.dwmc" label="拜访单位名称" placeholder="请输入拜访单位名称" />
    	</van-cell-group>
    	<van-cell-group>
    	  <van-field required v-model="all.bbfrxm" label="被拜访人姓名" placeholder="请输入被拜访人姓名" />
    	</van-cell-group>
    	<van-cell-group>
    	  <van-field required readonly clickable :value="all.xlkh" label="新客户/老客户" placeholder="请选择新客户/老客户" @click="kehuleixinglog = true"/>
    	</van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.bbfrlxfs" label="被拜访人联系方式" placeholder="请输入被拜访人联系方式" />
      </van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.yjtjrs" label="预计体检人数" placeholder="请输入预计体检人数" />
      </van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.yjkdj" label="预计客单价" placeholder="请输入预计客单价" />
      </van-cell-group>
      <van-cell-group>
        <van-field required readonly v-model="all.yjtjsj" label="选择时间" placeholder="请输入选择时间" @click="shijianlog = true" />
      </van-cell-group>
    	<van-cell-group>
    		<van-field required readonly clickable :value="all.bffs" label="拜访方式" placeholder="请选择拜访方式" @click="genjinzhuangtailog = true"/>
    	</van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.bfjg" label="拜访结果" placeholder="请输入拜访结果" />
      </van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.qdkn" label="签单可能性(%)" placeholder="请输入签单可能性(%)" />
      </van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.zysy" label="主要事宜" placeholder="请输入主要事宜" />
      </van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.bz" label="备注" placeholder="请输入备注" />
      </van-cell-group>
      <van-cell-group>
        <van-field required v-model="all.szwz" label="所在位置" placeholder="请输入所在位置" />
      </van-cell-group>




     <!-- <van-cell-group  v-if="what == 'shenpi'">
        <van-field required v-model="shenpiall.spyj" type="textarea" label="审批意见" placeholder="请输入审批意见" />
      </van-cell-group>
 -->
    	<div class="flexcc" style="margin-top: 0.3rem;" v-if="what == 'add'">
    		<van-button type="info" size="normal" @click="baocun">保存并提交审核</van-button>
    	</div>

      <!-- <div class="flexcc" style="margin-top: 0.3rem;" v-if="what == 'gonghai'">
      	<van-button type="info" size="normal" @click="gonghaibaocun">保存并提交审核</van-button>
      </div>

      <div class="flexcc" style="margin-top: 0.3rem;" v-if="what == 'shenpi'">
      	<van-button type="info" size="small" style="margin-right: 0.3rem; padding: 0 15px; border-radius: 0.1rem;" @click="shenpigo(0)">审批通过</van-button>
      	<van-button type="danger" size="small" style=" padding: 0 15px; border-radius: 0.1rem;" @click="shenpigo(1)">审批不通过</van-button>
      </div>

      <div class="flexcc" style="margin-top: 0.3rem;" v-if="what == 'bianji'">
      	<van-button type="info" size="small" style="margin-right: 0.3rem; padding: 0 15px; border-radius: 0.1rem;" @click="xiugai()">保存</van-button>
      	<van-button type="danger" size="small" style=" padding: 0 15px; border-radius: 0.1rem;" @click="back()">返回</van-button>
      </div> -->

    </div>

    <van-popup v-model="shijianlog" position="bottom" >
    	<van-datetime-picker v-model="all.yjtjsj" type="date" title="选择时间" @confirm="shijianConfirm" @cancel="shijianCancel" :min-date="minDate" :max-date="maxDate"  />
    </van-popup>

    <van-popup v-model="kehuleixinglog" position="bottom">
    	<van-picker title="请选择新客户/老客户" show-toolbar :columns="kehuleixing"  @confirm="sexConfirm" @cancel="sexCancel" />
    </van-popup>

    <van-popup v-model="genjinzhuangtailog" position="bottom">
    	<van-picker title="请选择拜访方式" show-toolbar :columns="genjinzhuangtai"  @confirm="genjinConfirm" @cancel="genjinCancel"/>
    </van-popup>


  </div>
</template>

<script>
  var h = document.documentElement.clientWidth / 7.5 + 'px';
  document.documentElement.style.fontSize = h;
	export default {
		name: 'index',
		data() {
			return {
        shijianlog:false,
          title:"新建拜访",
          what:'add',
          all:{
              // "id": "",
              "dwmc": "",
              "bbfrxm": "",
              "xlkh": "",
              "bbfrlxfs": "",
              "yjtjrs": "",
              "yjkdj": "",
              "yjtjsj": "",
              "bffs": "",
              "bfjg": "",
              "qdkn": "",
              "zysy": "",
              "bz": "",
              "szwz": "",
              // "createtime": "",
              "createid": JSON.parse(localStorage.getItem('person')).userid,
              "createname": "夏兆登"
          },
          minDate: new Date(1900, 0, 1),
          maxDate: new Date(2100, 10, 1),

         zhankai:false,
         kehuleixing:['新客户','老客户'],
         kehuleixinglog:false,
         genjinzhuangtai:['当面拜访','到店参观','到检','其他'],
         genjinzhuangtailog:false,


         shenpiall:{
           khid:"",
           fzrid:"",
           spyj:"",
           spzt:""
         }
			}
		},
		created() {
      if(this.$route.query.id){
        axios.get('/Customer/queryCustomerDetail?khid='+this.$route.query.id).then((response)=>{
        	if (response.data.state == 200) {
            this.all = response.data.data
        	} else {
            vant.Toast(response.data.msg);
        	}
        })

      }
      // if(this.$route.query.shenpi){
      //   this.what = 'shenpi'
      //   this.title = '客户审批'
      // }
      // if(this.$route.query.bianji){
      //   this.what = 'bianji'
      //   this.title = '客户编辑'
      // }
      // if(this.$route.query.gonghai){
      //   this.what = 'gonghai'
      //   this.title = '添加公海客户'
      // }
		},
		mounted() {

		},
		methods: {
      gonghaibaocun:function(){
        axios.post('/OpenCustomer/addOpencustomer',this.all).then((response)=>{
        	if (response.data.state == 200) {
            vant.Toast('新建公海客户成功');
        	} else {
            vant.Toast(response.data.msg);
        	}
        })
      },
      shenpigo:function(val){
        this.shenpiall.khid = this.all.id
        this.shenpiall.fzrid = this.all.fzrid
        this.shenpiall.spzt = val

        axios.post('/Process/updateCustomerProcess',this.shenpiall).then((response)=>{
        	if (response.data.state == 200) {
            vant.Toast('审批成功');
        	} else {
            vant.Toast(response.data.msg);
        	}
        })
      },
      xiugai:function(){
        axios.post('/Customer/updateCustomer',this.all).then((response)=>{
        	if (response.data.state == 200) {
            vant.Toast('修改客户成功');
            this.back()
        	} else {
            vant.Toast(response.data.msg);
        	}
        })
      },

      baocun:function(){
        axios.post('/Visit/addVisit',this.all).then((response)=>{
        	if (response.data.state == 200) {
            vant.Toast('新建拜访成功');
        	} else {
            vant.Toast(response.data.msg);
        	}
        })
      },

      shijianConfirm:function(val){

        this.all.yjtjsj =  moment(val).format('YYYY-MM-DD')

      	this.shijianlog = false
      },
      shijianCancel:function(val){
        this.shijianlog = false
      },

      sexConfirm:function(val){
        this.all.xlkh = val
      	this.kehuleixinglog = false
      },
      sexCancel:function(val){
        this.kehuleixinglog = false
      },

      genjinConfirm:function(val){
      	this.all.bffs = val
      	this.genjinzhuangtailog = false
      },
      genjinCancel:function(val){
      	this.genjinzhuangtailog = false
      }


		}
	}
</script>

<style scoped lang="less">


    .yy {
      box-shadow: 0 0 0.1rem #eaeaea;
      padding: 0.2rem 0.3rem;
      margin-bottom: 0.3rem;
    }

    .act {
      background: #ccc !important;
      color: #FFFFFF;
      padding: 0.1rem 0.2rem;
      border-radius: 0.1rem;
    }

    .act1 {
      background: #fff;
      box-shadow: 0 0 0.1rem #eaeaea;
      padding: 0.1rem 0.2rem;
      margin-left: 0.2rem;
      border-radius: 0.1rem;
    }

</style>
